<template>
  <div class="right-container">
    <!-- 废片模块 -->
    <div v-if="isReject" class="special-item">
      <div class="special-title reject-title">当前序列被标为废片</div>
      <div class="special-text reject-content">原因：{{ rejectValue }}</div>
    </div>
    <!-- 阴阳性 -->
    <div v-if="isYay" class="special-item">
      <div class="special-title" style="margin-bottom: 0">
        当前序列被标为{{ yayValue ? "阳性" : "阴性" }}
      </div>
    </div>
    <!-- 检查所见 -->
    <!-- 诊断所得 -->
    <!-- 序列征象部分 -->
    <component
      :is="seriesVisible ? SequenceSign : LabelingSignsVue"
      v-bind="{ seriesSettings, disabled, formRef }"
      @update:handle-change="handleChange"
    />
  </div>
</template>
<script lang="ts" setup>
import SequenceSign from "./components/sequenceSign.vue";
import LabelingSignsVue from "./components/labelingSigns.vue";
import type * as PHStoreType from "@/store/modules/processHeader/type";

const props = defineProps({
  isReject: {
    type: Boolean,
    default: false,
  },
  rejectValue: {
    type: String,
    default: "",
  },
  isYay: {
    type: Boolean,
    default: false,
  },
  yayValue: {
    type: Boolean,
    default: false,
  },
  seriesVisible: {
    type: Boolean,
    default: true,
  },
  seriesSettings: {
    type: Object,
    default: {} as PHStoreType.LesionData,
  },
  disabled: {
    type: Boolean,
    default: false
  },
  formRef: {
    type: Object,
    default: {}
  }
});
const emit = defineEmits(["update:handleChange"]);
const handleChange = ($event: any) => {
  emit("update:handleChange", {
    value: $event.$event,
    type: $event.type,
    signType: $event.signType,
    seriesSettings: props.seriesSettings
  });
};
</script>
<style lang="less" scoped>
.right-container {
  width: 300px;
  min-width: 300px;
  max-width: 300px;
  background: linear-gradient(180deg, #0c1a21 0%, #192c38 100%);
  height: 100%;
  overflow-y: auto;
  .special-item {
    padding: 12px 12px 16px;
    border-bottom: 1px solid #000;
    .special-title {
      font-weight: 400;
      font-size: 14px;
      color: #faad14;
      margin-bottom: 4px;
    }
    .special-text {
      font-weight: 400;
      font-size: 14px;
      color: #faad14;
    }
    .reject-title {
      font-weight: 400;
      font-size: 14px;
      line-height: 18px;
      margin-bottom: 8px;
      color: #faad14;
    }
    .reject-content {
      font-weight: 400;
      font-size: 14px;
      line-height: 18px;
      color: #faad14;
    }
  }
}
</style>
